@layout("/common/_curd/_container.html"){
<script type="text/javascript">
	var ctx = "${basePath}";
	var grid_selector = "#grid-table";
	var pager_selector = "#grid-pager";
	
	var grid_selector2 = "#grid-table2";
	var pager_selector2 = "#grid-pager2";
	
	$(function(){
		initGridTwo();
		initGrid();
		
	});
	
	function initGrid(){
		var grid_url = ctx + "/queueType/select_pagerqueuetype";
		var _colnames = [
		         		"ID", 
		         		"名称", 
						"操作"
						];
		var _colmodel = [{name:"queue_type_id", index:"queue_type_id", width:30},
						{name:"queuetypename", index:"queuetypename", width:100},
						{name:"queue_type_id", index:"add_btn",width:100,formatter:addBtn}
						];
		
		jQuery(grid_selector).jqGrid({
			url : grid_url,
		    shrinkToFit : true,
			colNames : _colnames,
			colModel : _colmodel,
			rowNum : 20,
			jsonReader : {id :"queue_type_id"},
			pager : pager_selector,
			postData : {sort : "queue_type_id", order : "desc",type:2,aid:"${aid}"}
		});
	}
	
	function initGridTwo(){
		var grid_url = ctx + "/queueType/select_pagerqueuetype";
		var _colnames = [
			         		"ID", 
			         		"名称"
			         		,"操作"
							];
			var _colmodel = [{name:"queue_type_id", index:"queue_type_id", width:30},
							{name:"queuetypename", index:"queuetypename", width:100},
							{name:"queue_type_id", index:"btn_id", width:100,formatter:initBtn}
							];
		
		jQuery(grid_selector2).jqGrid({
			url : grid_url,
		    shrinkToFit : true,
			colNames : _colnames,
			colModel : _colmodel, 
			jsonReader : {id :"queue_type_id"},
			pager : pager_selector2,
			postData : {sort : "queue_type_id", order : "desc",type:1,aid:"${aid}"}
		});
	}
	function initBtn(cellvalue, options, rowObject) {
		return "<button class='closebtn' data-id='"+cellvalue+"' type='button'><i class='ace-icon fa fa-close bigger-110'></i>移除</button>";
	}
	
	function addBtn(cellvalue, options, rowObject) {
		return "<button class='addbtn' data-id='"+cellvalue+"' type='button'><i class='ace-icon fa fa-check bigger-110'></i>添加</button>";
	}
	function picFormat(cellvalue, options, rowObject) {
        return '<img width="50" height="50" alt="" src="'+cellvalue+'" />';
    }
</script>


	<!-- 配置 grid -->
	<div class="row">
		<div class="row">
			<div class="col-xs-6 tb-grid">
				<div class="panel panel-success">
					<div class="panel-heading">
						<h3 class="panel-title">已添加的队列</h3>
					</div>
					<div class="panel-body">
						<table id="grid-table2" ></table>
						<!-- 分页-->
						<div id="grid-pager2"></div>
					</div>
				</div>
			</div>
			<div class="col-xs-6 tb-grid">
				<div class="panel panel-warning">
					<div class="panel-heading">
						<h3 class="panel-title">未添加的队列</h3>
						@ var _col=[
						@		{name:"名称", index:"queuetypename", type:"text"}		
						@];
						@ include("/common/_function/_search.html",{"col":_col}){}
						<!-- 按钮 -->
						<div class="welljq well-sm" id="btns"></div>
					</div>
					<div class="panel-body">
						<!-- grid -->
						<table id="grid-table"></table>
						<!-- 分页-->
						<div id="grid-pager"></div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		var aid="${aid}";
		$(function(){
			$("#grid-table2").on("click",".closebtn",function(){
				var data={'type':2,'aid':aid,'gid':$(this).data("id")};
				updateChild(data);
			});
			$("#grid-table").on("click",".addbtn",function(){
				var data={'type':1,'aid':aid,'gid':$(this).data("id")};
				updateChild(data);
			});
			
		});
		function updateChild(data){
			$.post(ctx+'/queueType/updatepagerChild',data,function(result){
				layer_alert(result.message, "success");
				if(result.code==0){
					jQuery("#grid-table").trigger("reloadGrid");
					jQuery("#grid-table2").trigger("reloadGrid");
				}
				
			},'json');
		};
		
	</script>
	<!-- 引入所需的js -->
	@include("/common/_listscript.html"){}
	
@}	